<template>
  <div>
    <h3>苹果10￥/斤，折扣8折</h3>

    <span>请输入你购买的斤数</span>

    <input type="text" v-model="count" />

    <hr />
    <button @click="btn">结账买单</button>
    <hr />

    <!-- 设置变量 -->
    <span
      >结账单：总价：{{ total }}￥元 --- 折后价：{{ dis }}￥元 --- 省了：{{
        save
      }}￥元</span
    >
  </div>
</template>

<script>
export default {
  data() {
    return {
      count: "",
      total: "",
      dis: "",
      save: "",
    };
  },
  methods: {
    btn() {
      this.total = this.count * 10;
      this.dis = this.total * 0.8;
      this.save = this.total - this.dis;
    },
  },
};
</script>

<style>
</style>